﻿@model Qu.ComputingContest.Model.Registration
           

@{
    ViewBag.Title = "Qatar University :: Computing Contest Registration";
    ViewBag.DoNotShowHomePage = true;
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section head {

    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/base/jquery-ui.css" type="text/css" media="all" />
    <link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" type="text/javascript"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>

	<style>
	    input:focus{border-width: 2px;border-color: LightBlue; border-style: solid;}
	    input, select {border-width: 1px; border-color: Black; margin-top:10px;} 
	    .ui-button { margin-left: -1px; }
	    .ui-button-icon-only .ui-button-text { padding: 0.35em; } 
	    .ui-autocomplete-input { margin: 0; padding: 0.48em 0 0.47em 0.45em; min-width: 600px;}
	    
	    em { font-weight: bold; padding-right: 1em; vertical-align: top; color: red; }
	</style>
	<script>
	    (function ($) {
	        $.widget("ui.combobox", {
	            _create: function () {
	                var self = this,
					select = this.element.hide(),
					selected = select.children(":selected"),
					value = selected.val() ? selected.text() : "";
	                var input = this.input = $("<input>")
					.insertAfter(select)
					.val(value)
					.autocomplete({
					    delay: 0,
					    minLength: 0,
					    source: function (request, response) {
					        var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
					        response(select.children("option").map(function () {
					            var text = $(this).text();
					            if (this.value && (!request.term || matcher.test(text)))
					                return {
					                    label: text.replace(
											new RegExp(
												"(?![^&;]+;)(?!<[^<>]*)(" +
												$.ui.autocomplete.escapeRegex(request.term) +
												")(?![^<>]*>)(?![^&;]+;)", "gi"
											), "<strong>$1</strong>"),
					                    value: text,
					                    option: this
					                };
					        }));
					    },
					    select: function (event, ui) {
					        ui.item.option.selected = true;
					        self._trigger("selected", event, {
					            item: ui.item.option
					        });
					    },
					    change: function (event, ui) {
					        if (!ui.item) {
					            var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"),
									valid = false;
					            select.children("option").each(function () {
					                if ($(this).text().match(matcher)) {
					                    this.selected = valid = true;
					                    return false;
					                }
					            });
					            if (!valid) {
					                // remove invalid value, as it didn't match anything
					                $(this).val("");
					                select.val("");
					                input.data("autocomplete").term = "";
					                return false;
					            }
					        }
					    }
					})
					.addClass("ui-widget ui-widget-content ui-corner-left");

	                input.data("autocomplete")._renderItem = function (ul, item) {
	                    return $("<li></li>")
						.data("item.autocomplete", item)
						.append("<a>" + item.label + "</a>")
						.appendTo(ul);
	                };

	                this.button = $("<button type='button'>&nbsp;Or List All Schools</button>")
					.attr("tabIndex", -1)
					.attr("title", "Show All Items")
					.insertAfter(input)
					.button({
					    icons: {
					        primary: "ui-icon-triangle-1-s"
					    },
					    text: true
					})
					.removeClass("ui-corner-all")
					.addClass("ui-corner-right ui-button-icon")
					.click(function () {
					    // close if already visible
					    if (input.autocomplete("widget").is(":visible")) {
					        input.autocomplete("close");
					        return;
					    }

					    // pass empty string as value to search for, displaying all results
					    input.autocomplete("search", "");
					    input.focus();
					});
	            },

	            destroy: function () {
	                this.input.remove();
	                this.button.remove();
	                this.element.show();
	                $.Widget.prototype.destroy.call(this);
	            }
	        });
	    })(jQuery);

	    $(function () {
	        $("#Mentor_SchoolID").combobox();
//	        $("#toggle").click(function () {
//	            $("#Mentor_SchoolID").toggle();
//	        });
	    });

	</script>

}
    @if (!string.IsNullOrEmpty(ViewBag.RegistrationClosedMessage))
    {
         <h2>@ViewBag.RegistrationClosedMessage</h2>
    } 
    else if (ViewBag.SuccessMessage != null)
    {
         <h2>@ViewBag.SuccessMessage</h2>
    }   
    else
    {
        <h1>Computing Contest Registration</h1>

        <p>
            @if (!string.IsNullOrEmpty(ViewBag.MaxKitsReachedMessage))
            {
                 <div style="color:Red;font-weight:bold;">@ViewBag.MaxKitsReachedMessage</div><br />
            }
            else
            {
            <div>Please note the following:</div>
            <ul style="padding-right:200px;">
                <li> The Department of Computer Science and Engineering has a limited number of Lego NXT2.0 kits to loan out on a first-come-first-serve basis. Early-registered schools will be lent ONE Lego NXT2.0 kit each. </li>
                <li> A school may participate with more than one team if they can provide their own Lego NXT2.0 kits. </li>
            </ul>
            }
            <div>Please provide the following information to complete your registration in the Computing Contest</div>
        </p>
        <br />
        using (Html.BeginForm("New", "Registration", FormMethod.Post))
        {
          @Html.ValidationSummary()
          @Html.EditorForModel()
          <p style="text-align:center; margin-top:10px;">
            <button type="submit">
              Register
            </button>
           </p>
        }
    }
